import QtQuick 2.0
import QtGraphicalEffects 1.0

Item {
    property alias viewModel: menuView.model
    property alias viewIndex: menuView.currentIndex

    id: rootMenu
    width: 80

    Rectangle {
        id: menuBars
        anchors.fill: parent
        color: "#393636"
        ListView {
            id: menuView
            anchors.fill: parent
            anchors.topMargin: 30
            spacing: 30
            focus: true
            delegate: menuItem
            interactive: false
        }
    }

    Component {
        id: menuItem
        Item {
            width: 80
            height: 80
            Item {
                id: img
                width: 50
                height: 50
                scale: 0.6
                anchors.horizontalCenter: parent.horizontalCenter
                Image {
                    anchors.fill: parent
                    fillMode: Image.PreserveAspectFit
                    smooth: true
                    source: iconImg
                }
            }
            Text {
                id: name
                anchors.top: img.bottom
                anchors.topMargin: 5
                anchors.horizontalCenter: parent.horizontalCenter
                font.family: "Microsoft Yahei"
                color: "white"
                text: iconName
            }
            layer {
                enabled: menuView.currentIndex == index ? true : false
                effect: ColorOverlay {
                    color: "#f8b62c"
                }
            }
            MouseArea {
                anchors.fill: parent
                onClicked: {
                    menuView.currentIndex = index
                }
            }
        }
    }
}
